<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<style>
			#container{
				border: 1px solid cyan;
				width: 70%;
				margin: 0 auto;
				color: white;
			}
			header{
				height: 100px;
				background-color: #42474B;
			}
			footer{
				height: 80px;
				background-color: #C1BAE8 ;
			}
			.content{
				display: flex;
			}
			.content .div01{
				background-color: #622B62;
				height: 300px;
				flex: 1;
			}
			.content .div02{
				background-color: #51C551;
				height: 300px;
				flex: 1;
			}
			.content .div03{
				background-color: #F6C5AC;
				height: 300px;
				flex: 2;
			}
		</style>
	</head>
	<body>
		<div id="container">
			<header>头部</header>
			<div class="content">
			<div class="div01">01</div>
			<div class="div02">02</div>
			<div class="div03">03</div>
			</div>
			<footer>底部</footer>
		</div>
	</body>
</html>
